import {
  // basic
  Icon,
  Button,
  Container,
  Header,
  Aside,
  Main,
  Row,
  Col,
  Tabs,
  TabPane,

  // form
  Form,
  FormItem,
  Input,
  DatePicker,
  Select,
  Option,
  OptionGroup,
  Cascader,
  Upload,
  Checkbox,
  CheckboxGroup,
  Radio,
  RadioGroup,
  // data
  Table,
  TableColumn,
  Empty,
  Result,
  Pagination,
  Tree,
  Progress,

  // notice
  Loading,
  Message,
  MessageBox,

  // navigation
  Menu,
  Submenu,
  MenuItemGroup,
  MenuItem,
  Dropdown,
  DropdownMenu,
  DropdownItem,

  // others
  Tooltip,
  Dialog,
  Image,
  Link,
  Tag,
  Popconfirm,
  Popover,
  Scrollbar,
} from 'element-ui';

// import "element-ui/packages/theme-chalk/src/base.scss";
import 'element-ui/packages/theme-chalk/src/common/transition.scss';
import 'element-ui/lib/theme-chalk/icon.css';

const components = [
  // basic
  Icon,
  Button,
  Container,
  Header,
  Aside,
  Main,
  Row,
  Col,
  Tabs,
  TabPane,

  // form
  Form,
  FormItem,
  Input,
  DatePicker,
  Select,
  Option,
  OptionGroup,
  Cascader,
  Upload,
  Checkbox,
  CheckboxGroup,
  Radio,
  RadioGroup,

  // data
  Table,
  TableColumn,
  Empty,
  Result,
  Pagination,
  Tree,
  Progress,

  // notice

  // navigation
  Menu,
  Submenu,
  MenuItemGroup,
  MenuItem,
  Dropdown,
  DropdownMenu,
  DropdownItem,

  // others
  Tooltip,
  Dialog,
  Image,
  Link,
  Tag,
  Popconfirm,
  Popover,
  Scrollbar,
];

const plugins = [Loading.directive];

// 定制 Message

function install(vue) {
  components.forEach((component) => {
    vue.component(component.name, component);
  });

  plugins.forEach((plugin) => {
    vue.use(plugin);
  });

  vue.prototype.$msgbox = MessageBox;
  vue.prototype.$alert = MessageBox.alert;
  vue.prototype.$confirm = MessageBox.confirm;
  vue.prototype.$prompt = MessageBox.prompt;
  vue.prototype.$message = Message;

  vue.prototype.$loading = Loading.service;

  vue.prototype.$ELEMENT = {
    size: 'small', // mini
    zIndex: 2000, // 默认值：2000
  };
}

export default {
  install,
};
